<template>
  <div id="ListView">
      <!-- 顶部 -->
      <!-- :srcImg='playlist.coverImgUrl' -->
      <ListViewTop :playlist='playlist'></ListViewTop>
      <!-- 底部 -->
      <ListViewBottom :playlist='playlist'></ListViewBottom>
      
	  <!-- 播放详情 -->	
	  <!-- <MusicDetail ></MusicDetail>	 -->
  </div>
</template>

<script type="text/javascript">
import ListViewTop from './ListViewTop/ListViewTop'
import ListViewBottom from '@/views/ListView/ListViewBottom/ListViewBottom'
import MusicDetail from '@/components/musicDetail/musicDetail.vue';

export default {
  name: "ListView",
  data() {
    return {
        listview:[],
        playlist:{
            tracks:[]//一开始他可能是空的
        }
    }
  },
  components: {
      ListViewTop,
      ListViewBottom,
	  MusicDetail
  },
  methods:{
      
  },
  created(){
      this.axios.get('/playlist/detail',{
          params:{
              id:this.$route.query.id
          }
      })
      .then(res=>{
          console.log(res);
          this.listview=res.data.privileges
        //   this.srcImg=res.data.playlist.coverImgUrl
          this.playlist=res.data.playlist
          //丢到vuex里面
          this.$store.commit('setPlayList',this.playlist.tracks)
      })
      .catch(err=>{
          console.log(err);
      })
  },
  
}
</script>

<style lang="less" scoped>
#ListView{
	// position: relative;
}
</style>
